// 路由规则
import Vue from 'vue'
import VueRouter from 'vue-router'

// import Login from '../components/login.vue'
// import Home from '../components/Home.vue'
// import Welcome from '../components/Welcome.vue'
// import User from '../components/user/User.vue'
// import Category from '../components/goods/category.vue'
// import GoodsList from '../components/goods/list.vue'
// import AddGoods from '../components/goods/addGoods.vue'
// import OrderList from '../components/order/list.vue'
// 路由懒加载 替换原来的import from ； webpackChunkName 用来分组，同样的名称会一起被加载
const Login = () => import(/* webpackChunkName: "login_home_welcome" */ '../components/login.vue')
const Home = () => import(/* webpackChunkName: "login_home_welcome" */ '../components/Home.vue')
const Welcome = () => import(/* webpackChunkName: "login_home_welcome" */ '../components/Welcome.vue')
const User = () => import(/* webpackChunkName: "user" */ '../components/user/User.vue')
const Category = () => import(/* webpackChunkName: "category" */ '../components/goods/category.vue')
const GoodsList = () => import(/* webpackChunkName: "goods" */ '../components/goods/list.vue')
const AddGoods = () => import(/* webpackChunkName: "goods" */ '../components/goods/addGoods.vue')
const OrderList = () => import(/* webpackChunkName: "order" */ '../components/order/list.vue')

const Main = () => import(/* webpackChunkName: "main" */ '../components/welcome/Main.vue')
const Search = () => import(/* webpackChunkName: "main" */ '../components/welcome/search.vue')
const ProductList = () => import(/* webpackChunkName: "search" */ '../components/welcome/search/productList.vue')
const ProductDetail = () => import(/* webpackChunkName: "search" */ '../components/welcome/search/productDetail.vue')
const MyCart = () => import(/* webpackChunkName: "myCart" */ '../components/welcome/myCart/myCart.vue')
const MyOrder = () => import(/* webpackChunkName: "myOrder" */ '../components/welcome/myOrder/myOrder.vue')
const CheckOrder = () => import(/* webpackChunkName: "checkOrder" */ '../components/welcome/myOrder/checkOrder.vue')
Vue.use(VueRouter)

const router = new VueRouter(
  {
    routes: [
      { path: '/', redirect: '/login' },
      { path: '/login', name: 'login', component: Login },
      {
        path: '/home',
        name: 'home',
        component: Home,
        // redirect 意思是，访问/home是重定向到/usercenter
        redirect: '/welcome',
        // children 意思是子路由
        children: [{
          path: '/welcome', name: 'welcome', component: Welcome
        }, {
          path: '/user', name: 'user', component: User
        }, {
          path: '/goods_category', name: 'goods_category', component: Category
        }, {
          path: '/goods_list', name: 'goods_list', component: GoodsList
        }, {
          path: '/goods_add', name: 'goods_add', component: AddGoods
        }, {
          path: '/order_list', name: 'order_list', component: OrderList
        }]
      },
      {
        path: '/main',
        name: 'main',
        component: Main,
        redirect: '/search',
        children: [{
          path: '/search', name: 'search', component: Search
        }, {
          path: '/productList', name: 'productList', component: ProductList
        }, {
          path: '/productDetail', name: 'productDetail', component: ProductDetail
        }, {
          path: '/myCart', name: 'myCart', component: MyCart
        }, {
          path: '/myOrder', name: 'myOrder', component: MyOrder
        }, {
          path: '/checkOrder', name: 'checkOrder', component: CheckOrder
        }]
      }
    ]
  })

// 挂载一个路由导航守卫（功能是检验url的访问权限）
router.beforeEach((to, from, next) => {
  // to 将要访问的路径
  // from 从哪个路径跳转而来
  // next 是一个函数，表示放行；next()放行，next('强制跳转的路径')
  if (to.path === '/login') return next()// 如果访问路径是/login,直接放行
  // 如果不是访问登陆页，先获取token，判断token是否存在
  const token = sessionStorage.getItem('CURRENT_TOKEN')
  if (!token) return next('/login') // 如果没有token 强制跳转到login
  next()
})
// 暴露 router
export default router
